Skip to content

Fix PointsDrawer hover/pin UX and PointsBreakdownTable accessibility#88

Merged
ashworks1706 merged 2 commits intocommit-that-shit-v3from
copilot/sub-pr-87
Mar 7, 2026
Merged

Fix PointsDrawer hover/pin UX and PointsBreakdownTable accessibility#88
ashworks1706 merged 2 commits intocommit-that-shit-v3from
copilot/sub-pr-87

Conversation

Copy link
Contributor

Copilot AI commented Mar 7, 2026

The PointsDrawer would close immediately on mouseLeave regardless of click state, making "toggle open" non-functional. The PointsBreakdownTable was also missing scope="col" on header cells and had no keyboard dismissal path on the drawer.

Changes

  • PointsDrawer.tsx: Introduce isPinned state to separate hover-preview from click-to-pin:
    • Mouse hover opens; mouseLeave only closes if not pinned
    • Clicking the tab toggles pinned state (and syncs isOpen)
    • Escape key closes and unpins via onKeyDown on the outer container
    • onBlur closes the drawer when focus leaves the container (unless pinned)
// Before: always closed on mouseLeave — toggle was broken
onMouseLeave={closeDrawer}
onClick={toggleOpen}

// After: hover previews, click pins, Escape/blur dismisses
onMouseLeave={handleMouseLeave}   // no-op when pinned
onClick={handleTogglePin}          // toggles isPinned + syncs isOpen
// outer div: onKeyDown={handleKeyDown}, onBlur={handleBlur}
  • PointsBreakdownTable.tsx: Add scope="col" to all <th> cells for proper AT table navigation alongside the existing row-spanned category cells.

  • ShopIndex.tsx: Remove unused PointsBreakdownTable import (lint error).


🔒 GitHub Advanced Security automatically protects Copilot coding agent pull requests. You can protect all pull requests by enabling Advanced Security for your repositories. Learn more about Advanced Security.

… UX, remove unused import

Co-authored-by: ashworks1706 <85481905+ashworks1706@users.noreply.github.com>
Copilot AI changed the title [WIP] Update shop UI for better points breakdown accessibility Fix PointsDrawer hover/pin UX and PointsBreakdownTable accessibility Mar 7, 2026
@ashworks1706 ashworks1706 marked this pull request as ready for review March 7, 2026 05:09
@ashworks1706 ashworks1706 requested a review from a team as a code owner March 7, 2026 05:09
@ashworks1706 ashworks1706 merged commit 436f20e into commit-that-shit-v3 Mar 7, 2026
@ashworks1706 ashworks1706 deleted the copilot/sub-pr-87 branch March 7, 2026 05:09
ashworks1706 added a commit that referenced this pull request Mar 7, 2026
* commit that shit

* Update src/components/Shop/CategorySection.tsx

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Signed-off-by: Ben Juntilla <ben@benjuntilla.com>

* Update CategorySection component

* commit that shit

* commit that shit

* added mid loop stopping

* edited animation issues

* edited animation issues

* Update src/components/Shop/PointsDrawer.tsx

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Signed-off-by: Ash Srivastava <85481905+ashworks1706@users.noreply.github.com>

* Update src/pages/Shop/ShopIndex.tsx

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Signed-off-by: Ash Srivastava <85481905+ashworks1706@users.noreply.github.com>

* Update src/components/Shop/ProductCarousel.tsx

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Signed-off-by: Ash Srivastava <85481905+ashworks1706@users.noreply.github.com>

* Update src/components/Shop/PointsBreakdownTable.tsx

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Signed-off-by: Ash Srivastava <85481905+ashworks1706@users.noreply.github.com>

* Fix PointsDrawer hover/pin UX and PointsBreakdownTable accessibility (#88)

* Initial plan

* fix: add scope=col to th headers, fix PointsDrawer pin/hover/keyboard UX, remove unused import

Co-authored-by: ashworks1706 <85481905+ashworks1706@users.noreply.github.com>

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: ashworks1706 <85481905+ashworks1706@users.noreply.github.com>

---------

Signed-off-by: Ben Juntilla <ben@benjuntilla.com>
Signed-off-by: Ash Srivastava <85481905+ashworks1706@users.noreply.github.com>
Co-authored-by: Ben Juntilla <ben@benjuntilla.com>
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Co-authored-by: Copilot <198982749+Copilot@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants